import React, {useContext, useEffect, useState} from 'react';
import {StatusBar, ImageBackground, View, ActivityIndicator, Dimensions} from 'react-native';
import { Button, Image, Text } from 'react-native-elements';

import LocaleContext from '../libs/locale';
import AsyncStorage from "@react-native-async-storage/async-storage";
import WalletContext from "../libs/wallet";
import {TouchableHighlight} from "react-native-gesture-handler";
import {formartMoney, sleep} from "../libs/helpers";
import {deAES, getGroupList} from "../libs/chatGroup";
import Toast from "react-native-simple-toast";
const {width,height,scale} = Dimensions.get("window");

const ChatGroupStart = ({ navigation,route }: any) => {
    const locale:any = useContext(LocaleContext);
    const wallet: any = useContext(WalletContext);
    const [showWaiting,setShowWaiting] = useState(false)
    const [progressLength,setProgressLength] = useState("0")
    const [TipInfo,setTipInfo] = useState("")

    const getMyChatGroupList = async () => {
        try {
            setTipInfo("正在获取网络数据")
            setShowWaiting(true);
            await sleep(0)
            let myChatGroupList = [];
            let myChatGroupListStr = await AsyncStorage.getItem("myChatGroupList");
            if (myChatGroupListStr) {
                myChatGroupList = JSON.parse(myChatGroupListStr);
            }

            let res = await getGroupList(wallet.address);
            setTipInfo("正在解析网络数据")
            for (let i = 0; i < res.groups.length; i++) {
                console.log(i)
                let data:any = {};
                try{
                    data = {
                        addressOut: res.groups[i].addressout,
                        Creator: res.groups[i].creator,
                        Key: deAES(wallet.seed, res.groups[i].key),
                        desc: res.groups[i].desc,
                        Voucher: res.groups[i].voucher,
                        type: "Gchat"
                    };
                }catch (e) {
                    continue;
                }

                let res_Index = myChatGroupList.findIndex((item: any) => item.addressOut === data.addressOut);
                if (res_Index > -1) {
                    let pl = ((i + 1) / res.groups.length).toString();
                    setProgressLength(pl);
                    continue;
                }
                myChatGroupList.push(data);

                let pl = ((i + 1) / res.groups.length).toString();
                await sleep(5000)
                setProgressLength(pl);
            }
            await AsyncStorage.setItem("myChatGroupList", JSON.stringify(myChatGroupList));
            setShowWaiting(false);
            setProgressLength("0");
        }catch (e) {
            setShowWaiting(false);
            setProgressLength("0");
        }
    }

    return (
        <>
            {
                showWaiting?
                    <View style={{width:width,height:height,backgroundColor:"#F5F5F5"}}>
                        <ActivityIndicator
                            animating={true}
                            color={'lightblue'}
                            size={50}
                            style={{width:width,backgroundColor:"#FFFAFA69",marginTop:0.3*height}}
                        />
                        <Text style={{alignSelf:"center",marginTop:20}}>{formartMoney((parseFloat(progressLength)*100).toString(),2)}% {TipInfo}</Text>
                        <View style={{backgroundColor:"#DCDCDC",width:width*0.8,height:20,borderRadius:10,marginTop:25,alignSelf:"center"}}/>
                        <View style={{backgroundColor:"#69BDF4",width:width*0.8*parseFloat(progressLength)>20?width*0.8*parseFloat(progressLength):20,height:20,borderRadius:10,marginTop:-20,alignSelf:"flex-start",marginLeft:width*0.1}}/>
                    </View>:null
            }
            <TouchableHighlight
                underlayColor={"#98FB98"}
                style={{margin:25,padding:25,backgroundColor:"#00FF00"}}
                onPress={()=>{
                navigation.navigate("ChatGroupCreate")
            }}>
                <Text>创建群聊</Text>
            </TouchableHighlight>
            <TouchableHighlight
                underlayColor={"#48D1CC"}
                style={{margin:25,padding:25,backgroundColor:"#00FFFF"}}
                onPress={()=>{
                navigation.navigate("ChatGroupJoin")
            }}>
                <Text>加入群聊</Text>
            </TouchableHighlight>

            <TouchableHighlight
                underlayColor={"#BC8F8F"}
                style={{margin:25,padding:25,backgroundColor:"#8B0000"}}
                onPress={()=>{
                    navigation.navigate("ChatGroupMy")
                }}>
                <Text>我的群聊</Text>
            </TouchableHighlight>
            <TouchableHighlight
                underlayColor={"#DA70D6"}
                style={{margin:25,padding:25,backgroundColor:"#8B008B"}}
                onPress={()=>{
                    navigation.navigate("ChatGroupQRscan")
                }}>
                <Text>扫码加入群聊</Text>
            </TouchableHighlight>
            <TouchableHighlight
                underlayColor={"#DA70D6"}
                style={{margin:25,padding:25,backgroundColor:"#8B008B"}}
                onPress={()=>{
                    getMyChatGroupList();

                }}>
                <Text>获取我加入的群聊</Text>
            </TouchableHighlight>

        </>
    );
};

export default ChatGroupStart;
